{%  block sw_category_link_settings %}
<mt-card
    class="sw-category-link-settings"
    position-identifier="sw-category-link-settings"
    :title="$t('sw-category.base.link.title')"
    :is-loading="isLoading"
>
    {% block sw_category_detail_link_type_select_main %}
    <sw-single-select
        v-model:value="mainType"
        class="sw-category-link-settings__type"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('sw-category.base.link.mainTypeLabel')"
        :placeholder="$t('sw-category.base.link.mainTypePlaceholder')"
        :options="linkTypeValues"
        show-clearable-button
    />
    {% endblock %}

    {% block sw_category_detail_link_type_select_entity %}
    <sw-single-select
        v-if="isInternal"
        v-model:value="category.linkType"
        class="sw-category-link-settings__entity"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('sw-category.base.link.internalTypeLabel')"
        :placeholder="$t('sw-category.base.link.internalTypePlaceholder')"
        :options="entityValues"
        show-clearable-button
        @update:value="changeEntity"
    />
    {% endblock %}

    {% block sw_category_detail_link_type_select_entity_category %}
    <template v-if="category.linkType === 'category'">
        <sw-category-tree-field
            :allowed-types="allowedCategoryTypes"
            :categories-collection="categoriesCollection"
            :placeholder="categoryLinkPlaceholder"
            :category-criteria="categoryCriteria"
            :single-select="true"
            :label="$t('global.entities.category')"
            :help-text="categoryLinkHelpText"
            class="sw-category-link-settings__selection-category"
            @selection-add="onSelectionAdd"
            @selection-remove="onSelectionRemove"
        />
    </template>
    {% endblock %}

    {% block sw_category_detail_link_type_select_entity_product %}
    <sw-entity-single-select
        v-if="category.linkType === 'product'"
        v-model:value="category.internalLink"
        class="sw-category-link-settings__selection-product"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('global.entities.product')"
        :placeholder="$t('sw-category.base.link.productPlaceholder')"
        :criteria="productCriteria"
        :display-variants="true"
        entity="product"
        show-clearable-button
    />
    {% endblock %}

    {% block sw_category_detail_link_type_select_entity_landing_page %}
    <sw-entity-single-select
        v-if="category.linkType === 'landing_page'"
        v-model:value="category.internalLink"
        class="sw-category-link-settings__selection-landing-page"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('global.entities.landing_page')"
        :placeholder="$t('sw-category.base.link.landingPagePlaceholder')"
        entity="landing_page"
        show-clearable-button
    />
    {% endblock %}

    {% block sw_category_detail_link_field %}
    <component
        :is="linkHasProtocol ? 'mt-url-field' : 'mt-text-field'"
        v-if="isExternal"
        v-model="category.externalLink"
        class="sw-category-link-settings__external-link"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('sw-category.base.link.linkLabel')"
        :placeholder="$t('sw-category.base.link.linkLabel')"
    />
    {% endblock %}

    <mt-switch
        v-if="isExternal"
        v-model="linkHasProtocol"
        class="sw-category-link-settings__link-has-protocol"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('sw-category.base.link.linkHasProtocol')"
    />

    {% block sw_category_detail_link_new_tab %}
    <mt-switch
        v-model="category.linkNewTab"
        class="sw-category-link-settings__link-new-tab"
        :disabled="!acl.can('category.editor') || undefined"
        :label="$t('sw-category.base.link.linkNewTabLabel')"
    />
    {% endblock %}
</mt-card>
{%  endblock %}
